<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>系统默认信息窗体展示</title>
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main.css?v=1.0"/>
    <script type="text/javascript"
            src="http://webapi.amap.com/maps?v=1.3&key=您的AK"></script>
    <style type="text/css">
        body {
            font-size: 12px;
        }
        .amap-info-close{
            top:10px;
        }
    </style>
</head>
<body>
<div id="mapContainer"></div>
<script type="text/javascript">
    //初始化地图对象，加载地图
    var map = new AMap.Map("mapContainer", {
        resizeEnable: true,
        zoom: 8
    });

    // 设置缩放级别和中心点
    map.setZoomAndCenter(8, [113.283447,23.121195]);
    var lnglats=[
        [113.113159,22.999894],
        [113.146118,23.00495],
        [113.541626,22.203712],
        [113.73938,23.030229]
    ];
    var infoWindow = new AMap.InfoWindow({offset:new AMap.Pixel(0,-30)});
    for(var i= 0,marker;i<lnglats.length;i++){
        var marker=new AMap.Marker({
            position:lnglats[i],
            map:map
        });
        marker.content='我是第'+(i+1)+'个Marker——<a href="http://www.baidu2b.com">my_url_demo</a>';
        marker.content= '<div class="info-title">高德地图信息窗体Demo</div><div class="info-content">'+
                '<img src="http://webapi.amap.com/images/amap.jpg">'+
                '高德地图信息窗体Demo<br/>'+
                '<a href="http://www.baidu2b.com" target="_blank">my_url_demo</a></div>';
        marker.on('click',markerClick);
        marker.emit('click',{target:marker});
    }
    function markerClick(e){
        infoWindow.setContent(e.target.content);
        infoWindow.open(map, e.target.getPosition());
    }
    map.setFitView();
</script>
<script type="text/javascript" src="http://webapi.amap.com/demos/js/liteToolbar.js"></script>

</body>
</html>